<template>
	<view>
		<view class="tabs">
			<view @click="istab=0" :class="istab==0?'item uijin':'item uibai'">基本信息</view>
			<view @click="istab=1" :class="istab==1?'item uijin':'item uibai'">基本排盘</view>
			<view @click="istab=2" :class="istab==2?'item uijin':'item uibai'">专业细盘</view>
			<view @click="istab=3" :class="istab==3?'item uijin':'item uibai'">断事笔记</view>
		</view>
		<!-- 切换TAB结束 -->
		<!-- 基本排盘开始 -->
		<view class="uibghui tophead">
			<view class="topleft">
				<text class="avatar uijin">&#xe662;</text>
				<text class="username uijin">{{data.base_info.name}}</text>
			</view>
			<view class="topright">
				<view class="nongli uibai">农历：{{data.base_info.nongli}} <text class="uijin">（{{data.base_info.sex}}）</text></view>
				<view class="nongli uibai" style="padding-top: 4px;">阳历：{{data.base_info.gongli}}</view>
			</view>
		</view>
		<!-- 四柱开始 -->
		<!-- 标题 -->
		<view class="mainitem" style="background-color: white;">
			<view class="one uihui">日期</view>
			<view class="two uihui">年柱</view>
			<view class="three uihui">月柱</view>
			<view class="four uihui">日柱</view>
			<view class="five uihui">时柱</view>
		</view>
		<!-- 主星 -->
		<view class="mainitem" style="background-color: #f8f8f8;">
			<view class="one uihui">主星</view>
			<view class="two font14" > {{data.detail_info.zhuxing.year}}</view>
			<view class="two font14" > {{data.detail_info.zhuxing.month}}</view>
			<view class="two font14" > {{data.detail_info.zhuxing.day}}</view>
			<view class="two font14" > {{data.detail_info.zhuxing.hour}}</view>
		</view>
		<!-- 天干 八字-->
		<view class="mainitem" style="background-color: white;">
			<view class="one uihui">天干</view>
			<view class="btwo font22"><text :class="formatwuxingshuxing(data.detail_info.sizhu.year.tg)">{{data.detail_info.sizhu.year.tg}}</text><image class="baziimg" :src="'../../static/' + formatwuxingshuxing(data.detail_info.sizhu.year.tg) + '.png'" mode="aspectFill"></image></view>
			<view class="bthree font22"><text :class="formatwuxingshuxing(data.detail_info.sizhu.month.tg)">{{data.detail_info.sizhu.month.tg}}</text><image class="baziimg" :src="'../../static/' + formatwuxingshuxing(data.detail_info.sizhu.month.tg) + '.png'" mode="aspectFill"></image></view>
			<view class="bfour font22"><text :class="formatwuxingshuxing(data.detail_info.sizhu.day.tg)">{{data.detail_info.sizhu.day.tg}}</text><image class="baziimg" :src="'../../static/' + formatwuxingshuxing(data.detail_info.sizhu.day.tg) + '.png'" mode="aspectFill"></image></view>
			<view class="bfive font22"><text :class="formatwuxingshuxing(data.detail_info.sizhu.hour.tg)">{{data.detail_info.sizhu.hour.tg}}</text><image class="baziimg" :src="'../../static/' + formatwuxingshuxing(data.detail_info.sizhu.hour.tg) + '.png'" mode="aspectFill"></image></view>
		</view>
		<!-- 地支 八-->
		<view class="mainitem" style="background-color: #f8f8f8;">
			<view class="one uihui">地支</view>
			<view class="btwo font22"><text :class="formatwuxingshuxing(data.detail_info.sizhu.year.dz)">{{data.detail_info.sizhu.year.dz}}</text><image class="baziimg" :src="'../../static/' + formatwuxingshuxing(data.detail_info.sizhu.year.dz) + '.png'" mode="aspectFill"></image></view>
			<view class="bthree font22"><text :class="formatwuxingshuxing(data.detail_info.sizhu.month.dz)">{{data.detail_info.sizhu.month.dz}}</text><image class="baziimg" :src="'../../static/' + formatwuxingshuxing(data.detail_info.sizhu.month.dz) + '.png'" mode="aspectFill"></image></view>
			<view class="bfour font22"><text :class="formatwuxingshuxing(data.detail_info.sizhu.day.dz)">{{data.detail_info.sizhu.day.dz}}</text><image class="baziimg" :src="'../../static/' + formatwuxingshuxing(data.detail_info.sizhu.day.dz) + '.png'" mode="aspectFill"></image></view>
			<view class="bfive font22"><text :class="formatwuxingshuxing(data.detail_info.sizhu.hour.dz)">{{data.detail_info.sizhu.hour.dz}}</text><image class="baziimg" :src="'../../static/' + formatwuxingshuxing(data.detail_info.sizhu.hour.dz) + '.png'" mode="aspectFill"></image></view>
		</view>
		<!-- 藏干 -->
		<view class="mainitem" style="background-color: white;">
			<view class="one uihui">藏干</view>
			<view class="two mycol">
				<view class="font13" v-for="(cgitem,index2) in data.detail_info.canggan.year" :key="index2">
				<text :class="formatwuxingshuxing(cgitem)">{{cgitem}}{{formatcanggan(cgitem)}}</text>
				</view>
			</view>
			<view class="two mycol">
				<view class="font13" v-for="(cgitem,index2) in data.detail_info.canggan.month" :key="index2">
				<text :class="formatwuxingshuxing(cgitem)">{{cgitem}}{{formatcanggan(cgitem)}}</text>
				</view>
			</view>
			<view class="two mycol">
				<view class="font13" v-for="(cgitem,index2) in data.detail_info.canggan.day" :key="index2">
				<text :class="formatwuxingshuxing(cgitem)">{{cgitem}}{{formatcanggan(cgitem)}}</text>
				</view>
			</view>
			<view class="two mycol">
				<view class="font13" v-for="(cgitem,index2) in data.detail_info.canggan.hour" :key="index2">
				<text :class="formatwuxingshuxing(cgitem)">{{cgitem}}{{formatcanggan(cgitem)}}</text>
				</view>
			</view>
		</view>
		<!-- 副星 地支藏干十食-->
		<view class="mainitem" style="background-color: #f8f8f8;">
			<view class="one uihui">副星</view>
			<view class="two mycol">
				<view class="font13" v-for="(cgitem,index2) in data.detail_info.fuxing.year" :key="index2">{{cgitem}}</view>
			</view>
			<view class="two mycol">
				<view class="font13" v-for="(cgitem,index2) in data.detail_info.fuxing.month" :key="index2">{{cgitem}}</view>
			</view>
			<view class="two mycol">
				<view class="font13" v-for="(cgitem,index2) in data.detail_info.fuxing.day" :key="index2">{{cgitem}}</view>
			</view>
			<view class="two mycol">
				<view class="font13" v-for="(cgitem,index2) in data.detail_info.fuxing.hour" :key="index2">{{cgitem}}</view>
			</view>
		</view>
		<!-- 星运 八字工生衰旺-->
		<view class="mainitem" style="background-color: white;">
			<view class="one uihui">星运</view>
			<view class="two mycol">
				<view class="font13" >{{data.detail_info.xingyun.year}}</view>
			</view>
			<view class="two mycol">
				<view class="font13" >{{data.detail_info.xingyun.month}}</view>
			</view>
			<view class="two mycol">
				<view class="font13" >{{data.detail_info.xingyun.day}}</view>
			</view>
			<view class="two mycol">
				<view class="font13" >{{data.detail_info.xingyun.hour}}</view>
			</view>
		</view>
		<!-- 自坐 -->
		<view class="mainitem" >
			<view class="one uihui">自坐</view>
			<view class="two mycol">
				<view class="font13" >{{data.detail_info.zizuo.year}}</view>
			</view>
			<view class="two mycol">
				<view class="font13" >{{data.detail_info.zizuo.month}}</view>
			</view>
			<view class="two mycol">
				<view class="font13" >{{data.detail_info.zizuo.day}}</view>
			</view>
			<view class="two mycol">
				<view class="font13" >{{data.detail_info.zizuo.hour}}</view> 
			</view>
		</view>
		<!-- 空亡 -->
		<view class="mainitem" style="background-color: white;">
			<view class="one uihui">空亡</view>
			<view class="two "><view class="font13" >  {{data.detail_info.kongwang.year}}</view></view>
			<view class="three "><view class="font13" >{{data.detail_info.kongwang.month}}</view></view>
			<view class="four "><view class="font13" > {{data.detail_info.kongwang.day}}</view></view>
			<view class="five "><view class="font13" > {{data.detail_info.kongwang.hour}}</view></view>
		</view>
		<!-- 纳音 -->
		<view class="mainitem" >
			<view class="one uihui">纳音</view>
			<view class="two ">  <view class="font12" >  {{data.detail_info.nayin.year}}</view></view>
			<view class="three "><view class="font12" >{{data.detail_info.nayin.month}}</view></view>
			<view class="four "> <view class="font12" > {{data.detail_info.nayin.day}}</view></view>
			<view class="five "> <view class="font12" > {{data.detail_info.nayin.hour}}</view></view>
		</view>
		<!-- 神煞 -->
		<view class="mainitem" style="background-color: white;">
			<view class="one uihui">神煞</view>
			<view class="two mycol">
				<view class="font13 uijin" v-for="(cgitem,index2) in data.detail_info.shensha.year.split(' ')" :key="index2">{{cgitem}}</view>
			</view>
			<view class="two mycol">
				<view class="font13 uijin" v-for="(cgitem,index2) in data.detail_info.shensha.month.split(' ')" :key="index2">{{cgitem}}</view>
			</view>
			<view class="two mycol">
				<view class="font13 uijin" v-for="(cgitem,index2) in data.detail_info.shensha.day.split(' ')" :key="index2">{{cgitem}}</view>
			</view>
			<view class="two mycol">
				<view class="font13 uijin" v-for="(cgitem,index2) in data.detail_info.shensha.hour.split(' ')" :key="index2">{{cgitem}}</view>
			</view>
		</view>
		<!-- 智能四柱按钮 -->
		<view class="znszbt">智能四柱图示</view>
		<!-- 基本排盘结束 -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				istab:1,
				data:{
					"base_info": { //基本信息
						"sex": "坤造", //性别
						"name": "张三", //求测者姓名
						"gongli": "1988年11月8日12时20分", //公历年
						"nongli": "戊辰年 九月 廿九日 午时", //农历年
						"qiyun": "9年6月26天起运", //起运
						"jiaoyun": "1998年4月16日16时52分1秒" //交运
					},
					"bazi_info": { //八字信息
						"kw": "戌亥", //空亡
						"tg_cg_god": [ //天干十神
							"伤官",
							"七杀",
							"日元",
							"劫财"
						],
						"bazi": [ //八字四柱
							"戊辰", //八字四柱【年】
							"癸亥", //八字四柱【月】
							"丁卯", //八字四柱【日】
							"丙午" //八字四柱【时】
						],
						"dz_cg": [ //地支藏干
							"戊|乙|癸", //地支藏干【年】
							"壬|甲", //地支藏干【月】
							"乙", //地支藏干【日】
							"丁|己" //地支藏干【时】
						],
						"dz_cg_god": [ //地支藏干十神
							"伤官|偏印|七杀", //地支藏干十神【年】
							"正官|正印", //地支藏干十神【月】
							"偏印", //地支藏干十神【日】
							"比劫|食神" //地支藏干十神【时】
						],
						"day_cs": [ //八字长生衰旺
							"衰", //八字长生衰旺【年】
							"胎", //八字长生衰旺【月】
							"病", //八字长生衰旺【日】
							"临官" //八字长生衰旺【时】
						],
						"na_yin": [ //五行纳音
							"大林木", //五行纳音【年】
							"大海水", //五行纳音【月】
							"炉中火", //五行纳音【日】
							"天河水" //五行纳音【时】
						]
					},
					"dayun_info": { //排大运信息
						"big_god": [ //大运神
							"正印",
							"偏印",
							"劫财",
							"比肩",
							"伤官",
							"食神",
							"偏财",
							"正财",
							"正官",
							"七杀",
							"正印",
							"偏印"
						],
						"big": [ //大运神对应天干地支
							"甲子",
							"乙丑",
							"丙寅",
							"丁卯",
							"戊辰",
							"己巳",
							"庚午",
							"辛未",
							"壬申",
							"癸酉",
							"甲戌",
							"乙亥"
						],
						"big_cs": [ //大运神对应长生衰旺
							"绝",
							"墓",
							"死",
							"病",
							"衰",
							"帝旺",
							"临官",
							"冠带",
							"沐浴",
							"长生",
							"养",
							"胎"
						],
						"xu_sui": [ //大运神对应虚岁
							11,
							21,
							31,
							41,
							51,
							61,
							71,
							81,
							91,
							101,
							111,
							121
						],
						"big_start_year": [ //大运始于年份
							1998,
							2008,
							2018,
							2028,
							2038,
							2048,
							2058,
							2068,
							2078,
							2088,
							2098,
							2108
						],
						"big_start_year_liu_nian": "", //大运流年
						"big_end_year": [ //大运止于年份
							2007,
							2017,
							2027,
							2037,
							2047,
							2057,
							2067,
							2077,
							2087,
							2097,
							2107,
							2117
						],
						"years_info0": [ //从大运第1个始于年到大运第1个止于年里所有年柱
							{
								"year_char": "戊寅"
							},
							{
								"year_char": "戊子"
							},
							{
								"year_char": "戊戌"
							},
							{
								"year_char": "戊申"
							},
							{
								"year_char": "戊午"
							},
							{
								"year_char": "戊辰"
							},
							{
								"year_char": "戊寅"
							},
							{
								"year_char": "戊子"
							},
							{
								"year_char": "戊戌"
							},
							{
								"year_char": "戊申"
							},
							{
								"year_char": "戊午"
							},
							{
								"year_char": "戊辰"
							}
						],
						"years_info1": [ //从大运第2个始于年到大运第2个止于年里所有年柱
							{
								"year_char": "己卯"
							},
							{
								"year_char": "己丑"
							},
							{
								"year_char": "己亥"
							},
							{
								"year_char": "己酉"
							},
							{
								"year_char": "己未"
							},
							{
								"year_char": "己巳"
							},
							{
								"year_char": "己卯"
							},
							{
								"year_char": "己丑"
							},
							{
								"year_char": "己亥"
							},
							{
								"year_char": "己酉"
							},
							{
								"year_char": "己未"
							},
							{
								"year_char": "己巳"
							}
						],
						"years_info2": [ //从大运第3个始于年到大运第3个止于年里所有年柱
							{
								"year_char": "庚辰"
							},
							{
								"year_char": "庚寅"
							},
							{
								"year_char": "庚子"
							},
							{
								"year_char": "庚戌"
							},
							{
								"year_char": "庚申"
							},
							{
								"year_char": "庚午"
							},
							{
								"year_char": "庚辰"
							},
							{
								"year_char": "庚寅"
							},
							{
								"year_char": "庚子"
							},
							{
								"year_char": "庚戌"
							},
							{
								"year_char": "庚申"
							},
							{
								"year_char": "庚午"
							}
						],
						"years_info3": [ //从大运第4个始于年到大运第4个止于年里所有年柱
							{
								"year_char": "辛巳"
							},
							{
								"year_char": "辛卯"
							},
							{
								"year_char": "辛丑"
							},
							{
								"year_char": "辛亥"
							},
							{
								"year_char": "辛酉"
							},
							{
								"year_char": "辛未"
							},
							{
								"year_char": "辛巳"
							},
							{
								"year_char": "辛卯"
							},
							{
								"year_char": "辛丑"
							},
							{
								"year_char": "辛亥"
							},
							{
								"year_char": "辛酉"
							},
							{
								"year_char": "辛未"
							}
						],
						"years_info4": [ //从大运第5个始于年到大运第5个止于年里所有年柱
							{
								"year_char": "壬午"
							},
							{
								"year_char": "壬辰"
							},
							{
								"year_char": "壬寅"
							},
							{
								"year_char": "壬子"
							},
							{
								"year_char": "壬戌"
							},
							{
								"year_char": "壬申"
							},
							{
								"year_char": "壬午"
							},
							{
								"year_char": "壬辰"
							},
							{
								"year_char": "壬寅"
							},
							{
								"year_char": "壬子"
							},
							{
								"year_char": "壬戌"
							},
							{
								"year_char": "壬申"
							}
						],
						"years_info5": [ //从大运第6个始于年到大运第6个止于年里所有年柱
							{
								"year_char": "癸未"
							},
							{
								"year_char": "癸巳"
							},
							{
								"year_char": "癸卯"
							},
							{
								"year_char": "癸丑"
							},
							{
								"year_char": "癸亥"
							},
							{
								"year_char": "癸酉"
							},
							{
								"year_char": "癸未"
							},
							{
								"year_char": "癸巳"
							},
							{
								"year_char": "癸卯"
							},
							{
								"year_char": "癸丑"
							},
							{
								"year_char": "癸亥"
							},
							{
								"year_char": "癸酉"
							}
						],
						"years_info6": [ //从大运第73个始于年到大运第7个止于年里所有年柱
							{
								"year_char": "甲申"
							},
							{
								"year_char": "甲午"
							},
							{
								"year_char": "甲辰"
							},
							{
								"year_char": "甲寅"
							},
							{
								"year_char": "甲子"
							},
							{
								"year_char": "甲戌"
							},
							{
								"year_char": "甲申"
							},
							{
								"year_char": "甲午"
							},
							{
								"year_char": "甲辰"
							},
							{
								"year_char": "甲寅"
							},
							{
								"year_char": "甲子"
							},
							{
								"year_char": "甲戌"
							}
						],
						"years_info7": [ //从大运第8个始于年到大运第8个止于年里所有年柱
							{
								"year_char": "乙酉"
							},
							{
								"year_char": "乙未"
							},
							{
								"year_char": "乙巳"
							},
							{
								"year_char": "乙卯"
							},
							{
								"year_char": "乙丑"
							},
							{
								"year_char": "乙亥"
							},
							{
								"year_char": "乙酉"
							},
							{
								"year_char": "乙未"
							},
							{
								"year_char": "乙巳"
							},
							{
								"year_char": "乙卯"
							},
							{
								"year_char": "乙丑"
							},
							{
								"year_char": "乙亥"
							}
						],
						"years_info8": [ //从大运第9个始于年到大运第9个止于年里所有年柱
							{
								"year_char": "丙戌"
							},
							{
								"year_char": "丙申"
							},
							{
								"year_char": "丙午"
							},
							{
								"year_char": "丙辰"
							},
							{
								"year_char": "丙寅"
							},
							{
								"year_char": "丙子"
							},
							{
								"year_char": "丙戌"
							},
							{
								"year_char": "丙申"
							},
							{
								"year_char": "丙午"
							},
							{
								"year_char": "丙辰"
							},
							{
								"year_char": "丙寅"
							},
							{
								"year_char": "丙子"
							}
						],
						"years_info9": [ //从大运第10个始于年到大运第10个止于年里所有年柱
							{
								"year_char": "丁亥"
							},
							{
								"year_char": "丁酉"
							},
							{
								"year_char": "丁未"
							},
							{
								"year_char": "丁巳"
							},
							{
								"year_char": "丁卯"
							},
							{
								"year_char": "丁丑"
							},
							{
								"year_char": "丁亥"
							},
							{
								"year_char": "丁酉"
							},
							{
								"year_char": "丁未"
							},
							{
								"year_char": "丁巳"
							},
							{
								"year_char": "丁卯"
							},
							{
								"year_char": "丁丑"
							}
						]
					},
					"start_info": {
						"jishen": [ //吉神凶煞
							"太极", //吉神凶煞【年】
							"空亡 福星 学堂 亡神 元辰(大耗) 红鸾", //吉神凶煞【月】
							"太极 六厄", //吉神凶煞【日】
							"禄神 天厨 灾煞 干禄" //吉神凶煞【时】
						],
						"xz": "天蝎座", //星座
						"sx": "龙" //生肖
					},
					"detail_info": { //八字详细信息
						"zhuxing": { //四柱主星
							"year": "伤官", //年柱主星
							"month": "比肩", //月柱主星
							"day": "日元", //日柱主星
							"hour": "食神" //时柱主星
						},
						"sizhu": { //四柱天干地支
							"year": {
								"tg": "己", //年柱天干
								"dz": "巳" //年柱地支
							},
							"month": {
								"tg": "丙", //月柱天干
								"dz": "子" //月柱地支
							},
							"day": {
								"tg": "丙", //日柱天干
								"dz": "寅" //日柱地支
							},
							"hour": {
								"tg": "戊", //时柱天干
								"dz": "子" //时柱地支
							}
						},
						"canggan": { //四柱藏干信息
							"year": [ //年柱藏干
								"丙",
								"戊",
								"庚"
							],
							"month": [ //月柱藏干
								"癸"
							],
							"day": [ //日柱藏干
								"甲",
								"丙",
								"戊"
							],
							"hour": [ //时柱藏干
								"癸"
							]
						},
						"fuxing": { //四柱副星信息
							"year": [ //年柱副星
								"比肩",
								"食神",
								"正财"
							],
							"month": [ //月柱副星
								"正官"
							],
							"day": [ //日柱副星
								"偏印",
								"比肩",
								"食神"
							],
							"hour": [ //时柱副星
								"正官"
							]
						},
						"xingyun": { //四柱星运信息
							"year": "临官", //年柱星运
							"month": "胎", //月柱星运
							"day": "长生", //日柱星运
							"hour": "胎" //时柱星运
						},
						"zizuo": { //四柱自坐信息
							"year": "帝旺", //年柱自坐
							"month": "胎", //月柱自坐
							"day": "长生", //日柱自坐
							"hour": "胎" //时柱自坐
						},
						"kongwang": { //四柱空亡信息
							"year": "戌亥", //年柱空亡
							"month": "申酉", //月柱空亡
							"day": "戌亥", //日柱空亡
							"hour": "午未" //时柱空亡
						},
						"nayin": { //四柱纳音信息
							"year": "大林木", //年柱纳音
							"month": "涧下水", //月柱纳音
							"day": "炉中火", //日柱纳音
							"hour": "霹雳火" //时柱纳音
						},
						"shensha": { //四柱神煞信息
							"year": "天德 禄神 亡神 干禄", //年柱神煞
							"month": "天乙 福星 天厨 六厄", //月柱神煞
							"day": "福星 国印 红艳 劫煞 词馆", //日柱神煞
							"hour": "天乙 福星 天厨 六厄" //时柱神煞
						},
						"dayunshensha": [ //大运神煞
							{
								"tgdz": "戊辰", //第1个大运天干地支
								"shensha": "太极 " //第1个大运神煞
							},
							{
								"tgdz": "丁卯", //第2个大运天干地支
								"shensha": "太极 月德 桃花 " //第2个大运神煞
							},
							{
								"tgdz": "丙寅",
								"shensha": "福星 红艳 "
							},
							{
								"tgdz": "乙丑",
								"shensha": "福星 国印 "
							},
							{
								"tgdz": "甲子",
								"shensha": "太极 福星 天厨 "
							},
							{
								"tgdz": "癸亥",
								"shensha": "空亡 天医 天厨 劫煞 "
							},
							{
								"tgdz": "壬戌",
								"shensha": "空亡 华盖 "
							},
							{
								"tgdz": "辛酉",
								"shensha": "太极 "
							},
							{
								"tgdz": "庚申",
								"shensha": "文昌 驿马 "
							},
							{
								"tgdz": "己未",
								"shensha": "太极 金舆 福星 流霞 "
							},
							{
								"tgdz": "戊午",
								"shensha": "羊刃 天厨 将星 "
							},
							{
								"tgdz": "丁巳", //第12个大运天干地支
								"shensha": "天德 月德 禄神 天厨 亡神 干禄 " //第12大运神煞
							}
						]
					}
				}
			}
		},
		methods: {
			/**
			 * 天干地支八字，格式化属性：样式颜色和图标
			 * 通过格式化对应上CSS样式和图标文件名
			 */
			formatwuxingshuxing(e){
				switch (e) {
				    case '庚':
				        return 'jin'
				    case '辛':
				        return 'jin'
				    case '申':
				        return 'jin'
					case '酉':
					    return 'jin'
					case '甲':
					    return 'mu'
					case '乙':
					    return 'mu'
					case '寅':
					    return 'mu'
					case '卯':
					    return 'mu'		
					case '壬':
					    return 'shui'
					case '癸':
					    return 'shui'			
					case '子':
					    return 'shui'			
					case '亥':
					    return 'shui'			
					case '丙':
					    return 'huo'			
					case '丁':
					    return 'huo'			
					case '巳':
					    return 'huo'			
					case '午':
					    return 'huo'			
					case '戊':
					    return 'tu'			
					case '己':
					    return 'tu'				
					case '丑':
					    return 'tu'				
					case '辰':
					    return 'tu'	
					case '未':
					    return 'tu'	
					case '戌':
					    return 'tu'						
				}
			},
			/**
			 * @param {Object} e
			 * 格式化藏干补充属性文字
			 */
		formatcanggan(e){
			switch (e) {
			    case '庚':
			        return '金'
			    case '辛':
			        return '金'
			    case '申':
			        return '金'
				case '酉':
				    return '金'
				case '甲':
				    return '木'
				case '乙':
				    return '木'
				case '寅':
				    return '木'
				case '卯':
				    return '木'		
				case '壬':
				    return '水'
				case '癸':
				    return '水'			
				case '子':
				    return '水'			
				case '亥':
				    return '水'			
				case '丙':
				    return '火'			
				case '丁':
				    return '火'			
				case '巳':
				    return '火'			
				case '午':
				    return '火'			
				case '戊':
				    return '土'			
				case '己':
				    return '土'				
				case '丑':
				    return '土'				
				case '辰':
				    return '土'	
				case '未':
				    return '土'	
				case '戌':
				    return '土'						
			}
		}	
		}
	}
</script>

<style lang="scss">
	.mycol{
		display: flex;
		flex-direction: column;
		//align-items: center;
		//justify-content: center;
	}
	.font22{
		font-size: 22px;
		font-weight: bold;
	}
	.baziimg{
		width: 20px;
		height: 20px;
		padding-left: 4px;
	}
	.btwo{
		flex: 1;
	}
	.bthree{
		flex: 1;
	}
	.bfour{
		flex: 1;
	}
	.bfive{
		flex: 1;
	}
	.znszbt{
		margin: 10px;
		padding: 8px 15px;
		background-color: white;
		text-align: center;
		border-radius: 6px;
	}
	.mainitem{
		display: flex;
		padding-bottom: 6px;
		padding-top: 6px;
		text-align: center;
	}
	.one{
		flex: 1;
	}
	.two{
		flex: 1;
	}
	.three{
		flex: 1;
	}
	.four{
		flex: 1;
	}
	.five{
		flex: 1;
	}
	.avatar{
		font-family: myfont;
		border: #b2955d solid 1px;
		padding: 4px;
		font-size: 38px;
		border-radius: 50px;
	}
	.username{
		padding-top: 4px;
		font-size: 16px;
	}
	.tabs {
		background-color: black;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		padding: 10px;
		
	}
	.item {
		//color: white;
		font-size: 16px;
	}
	.tophead{
		padding: 10px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.topright{
		//flex: 1;
		margin-left: 25px;
		font-size: 14px;
	}
	.topleft{
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	page {
		background-color: #f8f8f8;
	}
</style>